<template>
	<view class="my-userinfo-container">
		<!-- 头像和昵称区域 -->
		<view class="top-box">
			<image src="" class="avatar"></image>
			<view class="nickname">
				xxx
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState} from "vuex"
	export default {
		name:"my-userinfo",
		computed:{
			...mapState("m_user",['userinfo'])
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.my-userinfo-container{
	height: 100%;
	background-color: #F4F4F4;
	.top-box{
		height: 400rpx;
		background-color: #C00000;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		.avatar{
			display: block;
			width: 90px;
			height: 90px;
			border-radius: 45px;
			border: 2px solid #FFF;
			box-shadow: 0 1px 5px black;
		}
		.nickname{
			
		}
	}
}
</style>